import React, { Component } from 'react'
import axios from "../../utils/myAxios"
import "./shortVideos.scss"

export default class shortVideos extends Component {
    state={
        short:[],
        num:[]
      }
    componentDidMount(){
        axios.get("/asgard/asgardapi/sns/common/feed/channel/list.json?uuid=7912B020FA3511EA83AC6D256CB23356A86A2DB89B544C4A8E131835FC20BBD1&token=GPGTltZTr6--834mnlH7rJ6_ptUAAAAAkgsAAIwsBif-Pt16wmyF-4XBLnljabB-EuN8ecrV79FvIlF9wJ0WTFitXv861Fxb8C8TKQ&channelId=4&feedChannelId=105&timestamp=1601021899520&limit=1"
    ).then(res=>{
      this.setState({
        short:res.data.feeds
      })
      this.setState({
        num:res.data.feeds[0].upCount
      })
    })
    }
    handleClick=(params) => {
        let nm=this.state.num
        this.setState({
            num:nm+1
        })
          
    }
    
    render() {
        return (
            <div className="videos">
                {this.state.short.map((v,index)=>{
                    return(
                        <div className="videos1" key={index}>
                            <video src={v.video.url} autoPlay controls > </video>
                        <i>{v.user.nickName}</i>
                        <span>{v.title}</span>
                        <ul>
                            <li><img src={v.user.avatarurl} alt=""/></li>
                            <li  onClick={this.handleClick}><div className="dianzan"></div></li>
                    <li>{this.state.num}</li>
                            <li><div className="pinlun"></div></li>
                            <li>评论</li>
                            <li><div className="fenxiang"></div></li>
                            <li>分享</li>
                        </ul>
                        </div>
                    )
                })}
            </div>
        )
    }
}
